<template>
	<view>
		<!-- 正常商品 -->
	 <view class="normal-price-box"  
	 	style="display: flex;-webkit-justify-content: space-between;justify-content: space-between;">
	 	<view class="u-felx u-col-bottom">
	 		<text class="unit ">￥</text>
	 		<text class="price ">{{ detail.price?detail.price.toFixed(2):"" }}</text>
	 		<text class="original-price"
	 			style="margin-left: 10rpx; color: red;">赚：￥{{ ((detail.price-detail.cost)*rebate/100).toFixed(2) }}</text>
			<text class="original-price"
					style="margin-left: 10rpx;">佣金比例：￥{{ rebate.toFixed(2) }}%</text>
	 	</view>
	 	<view class="u-flex u-row-left price-bottom-box">
	 		<view class="u-flex">
	 			<view style="font-size: 26rpx;color: #333;">已售：{{ detail.paySales }}件</view>
	 		</view>
	 	</view>
	 </view>

		</view>
	</view>
</template>

<script>
/**
 * 商品详情价格卡片
 * @property {Object} detail - 商品详情
 * @property {String} type - 商品分类
 */
let timer = null;
export default {
	components: {},
	data() {
		return {
			time: {}, //倒计时
			activityRules: {
				startTime: 0,
				endTime: 0,
				status: '',
				countDownTime: 0
			}
		};
	},
	props: {
	 
		
		detail: {
			type: Object,
			default: () => {}
		},
		rebate: {
			type: Number,
			default:""
		}
	},
	created() {
		
		
		
	},
	beforeDestroy() {
		clearInterval(timer);
		timer = null;
	},
	computed: {
		// 百分比
		percent() {
			let unit = 0;
			if (this.detail.id) {
				unit = this.detail.stock + this.detail.sales > 0 ? ((this.detail.sales / (this.detail.sales + this.detail.stock)) * 100).toFixed(2) : 0;
			}
			return Number(unit);
		}
	},
	methods: {
	 
		 
	}
};
</script>

<style lang="scss">
 
 .normal-price-box {
 	padding: 20rpx 20rpx  0 20rpx;
 	background: #fff;
 	background-size: 100% 100%;
 
 	.unit,
 	.notice {
 		font-size: 24rpx;
 		color: #F75A2F;
 	}
 
 	.price {
 		font-size: 36rpx;
 		color: #F75A2F;
 		font-weight: bold;
 
 	}
 
 	.price-bottom-box {
 		.line {
 			margin: 0 20rpx;
 			display: inline-block;
 			width: 3rpx;
 			height: 24rpx;
 			background-color: #F75A2F;
 		}
 	}
 }
 
 .original-price {
 	font-size: 24rpx;
 	color: #333;
 	font-weight: 500;
 	padding-top: 10rpx;
 }
 
 // 团购商品
 .groupon-price-box {
 	padding: 20rpx;
 	background: url($IMG_URL+'/imgs/detail/detail_group_price_bg.png') no-repeat;
 	background-size: 100% 100%;
 
 	.unit,
 	.notice {
 		font-size: 24rpx;
 		color: rgba(#fff, 0.9);
 	}
 
 	.notice {
 		line-height: 40rpx;
 		border: 1rpx solid rgba(255, 255, 255, 1);
 		border-radius: 6rpx;
 		padding: 0 10rpx;
 	}
 
 	.price {
 		font-size: 36rpx;
 		color: rgba(#fff, 0.9);
 		font-weight: bold;
 		margin: 0 10rpx;
 	}
 
 	.price-bottom-box {
 		font-size: 24rpx;
 		color: rgba(#fff, 0.9);
 		font-weight: 500;
 		padding-top: 10rpx;
 
 		.line {
 			margin: 0 20rpx;
 			display: inline-block;
 			width: 3rpx;
 			height: 24rpx;
 			background-color: #fff;
 		}
 
 		.count-down {
 			font-size: 24rpx;
 			color: rgba(#fff, 0.9);
 		}
 	}
 }
</style>
